<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:body>
        <ui:composition template="./../template/main.xhtml">
            <ui:define name="content">
                 <h1 class="title ui-widget-header ui-corner-all ">Quản Lý Hóa Đơn</h1>
                <p:messages id="messages" showDetail="true" autoUpdate="true" closable="true"/>
                <!-- Insert Form -->
                <h:form id="insertForm">
                    <p:panel header="Tìm kiếm" style="margin-bottom: 20px; width: 300px">
                        <h:panelGrid styleClass="my-panel-grid" columns="2">
                            <h:outputText value="Số ĐT KH:"/>
                            <p:inputText value="#{deliveryNoteController.selectedPhone}"/>

                            <p:outputLabel value="Ngày:"/>
                            <p:calendar value="#{deliveryNoteController.selectedDate}" 
                                        navigator="true" yearRange="c-100:c-0" maxdate="31/12/2020" 
                                        pattern="dd/MM/yyyy" showOn="button"/>

                            <p:outputLabel value="Giao?"/>
                            <p:selectBooleanCheckbox value="#{deliveryNoteController.selectedState}"/>

                            <p:outputLabel value="Cửa hàng:"/>
                            <p:autoComplete value="#{deliveryNoteController.selectedStore.id}" 
                                            completeMethod="#{storeController.completeStore}" 
                                            var="p" itemLabel="#{p.name}" itemValue="#{p.id}" forceSelection="true">
                            </p:autoComplete>

                            <p:commandButton id="searchButton" update=":insertForm:deliveryNoteDataTable" actionListener="#{deliveryNoteController.search()}" icon="ui-icon" value="Tìm"/>
                        </h:panelGrid>
                    </p:panel>
                    
                    <!-- Data Table -->
                    <p:dataTable style="text-align: center" id="deliveryNoteDataTable" var="deliveryNote" value="#{deliveryNoteController.deliveryNoteList}" paginator="true" rows="10" 
                                 paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}" rowsPerPageTemplate="5,10,15" paginatorPosition="bottom"
                                 filteredValue="#{deliveryNoteController.filterDeliveryNotes}" emptyMessage="Không có đơn đặt hàng">
                        
                        <p:column headerText="ID">
                            <p:outputLabel value="#{deliveryNote.id}"/>
                        </p:column>
                        
                        <p:column headerText="Tên KH">
                            <p:outputLabel value="#{deliveryNote.username}"/>
                        </p:column>
                        
                        <p:column headerText="Giới tính">
                            <p:selectBooleanCheckbox value="#{deliveryNote.gender}" disabled="true"/>
                        </p:column>
                        
                        <p:column headerText="Điện thoại">
                            <p:outputLabel value="#{deliveryNote.phone}"/>
                        </p:column>
                        
                        <p:column headerText="Địa chỉ">
                            <p:outputLabel value="#{deliveryNote.address}"/>
                        </p:column>
                        
                        <p:column headerText="Cửa hàng">
                            <p:outputLabel value="#{deliveryNote.store.name}"/>
                        </p:column>
                        
                        <p:column headerText="Ngày">
                            <p:outputLabel value="#{deliveryNote.date}">
                                <f:convertDateTime pattern="dd/MM/yyyy"/>
                            </p:outputLabel>
                        </p:column>
                        
                        <p:column headerText="Tổng tiền">
                            <p:outputLabel value="#{deliveryNote.total}">
                                <f:convertNumber type="number"/>
                            </p:outputLabel>
                        </p:column>
                        
                        <p:column headerText="Duyệt?">
                            <p:selectBooleanCheckbox value="#{deliveryNote.approve}" disabled="true"/>
                        </p:column>
                        
                        <p:column headerText="Giao?">
                            <p:selectBooleanCheckbox value="#{deliveryNote.state}" disabled="true"/>
                        </p:column>
                        
                        <!-- Actions -->
                        <p:column>
                            <p:commandButton id="btnViewDetails" update=":viewDetailsForm" oncomplete="PF('viewDetailsDialog').show()" icon="ui-icon ui-icon-arrow-4-diag" title="Chi tiết">
                                <f:setPropertyActionListener value="#{deliveryNote}" target="#{deliveryNoteController.selectedDeliveryNote}"/>  
                            </p:commandButton>
                            <p:commandButton id="btnUpdateDeliveryNote" update=":updateDeliveryNoteForm" oncomplete="PF('updateDeliveryNoteDialog').show()" icon="ui-icon ui-icon-wrench" title="Sửa">
                                <f:setPropertyActionListener value="#{deliveryNote}" target="#{deliveryNoteController.selectedDeliveryNote}"/>  
                            </p:commandButton>
                            <p:commandButton id="btnDelete" update=":deleteForm" oncomplete="PF('confirmation').show()" icon="ui-icon ui-icon-closethick" title="Xóa">
                                <f:setPropertyActionListener value="#{deliveryNote}" target="#{deliveryNoteController.selectedDeliveryNote}"/>  
                            </p:commandButton>
                        </p:column>
                    </p:dataTable>
                </h:form>
                
                <!-- Delete Form -->
                <h:form id="deleteForm">
                    <p:confirmDialog closable="false" showEffect="fade" hideEffect="fade" severity="alert" widgetVar="confirmation" message="Xóa phiếu?" header="Xóa phiếu" style="margin: 5px auto">
                        <h:panelGroup layout="block" style="text-align: right">
                            <p:commandButton value="Đồng ý" action="#{deliveryNoteController.deleteDeliveryNote()}" oncomplete="confirmation.hide();" update=":insertForm, :messages"/>
                            <p:commandButton value="Hủy bỏ" oncomplete="confirmation.hide();"/>
                        </h:panelGroup>
                    </p:confirmDialog>
                </h:form>
                
                <!-- Delete Form -->
                <h:form id="deleteDetailsForm">
                    <p:confirmDialog closable="false" showEffect="fade" hideEffect="fade" severity="alert" widgetVar="detailsconfirmation" message="Xóa chi tiết?" header="Xóa chi tiết" style="margin: 5px auto">
                        <h:panelGroup layout="block" style="text-align: right">
                            <p:commandButton value="Đồng ý" action="#{deliveryNoteController.deleteDeliveryNoteDetails()}" oncomplete="detailsconfirmation.hide();" update=":viewDetailsForm:deliveryNoteDetailsForm, :messages"/>
                            <p:commandButton value="Hủy bỏ" oncomplete="detailsconfirmation.hide();"/>
                        </h:panelGroup>
                    </p:confirmDialog>
                </h:form>
                
                <!-- View Details Form -->
                <h:form id="viewDetailsForm">
                    <p:dialog header="Chi tiết" widgetVar="viewDetailsDialog" resizable="false" showEffect="fade" hideEffect="fade" modal="true">
                        <p:dataTable style="text-align: center" id="deliveryNoteDetailsForm" var="deliveryNoteDetails" value="#{deliveryNoteController.deliveryNoteDetailsList}" 
                                     emptyMessage="Không có chi tiết">
                            
                            <p:column headerText="ID">
                                <h:outputText value="#{deliveryNoteDetails.id}"/>
                            </p:column>
                            
                            <p:column headerText="Sản phẩm">
                                <h:outputText value="#{deliveryNoteDetails.phoneCode.phone.name}"/>
                            </p:column>
                            
                            <p:column headerText="Màu">
                                <h:outputText value="#{deliveryNoteDetails.phoneCode.color.name}"/>
                            </p:column>
                            
                            <p:column headerText="Số lượng">
                                <h:outputText value="#{deliveryNoteDetails.quantity}"/>
                            </p:column>
                            
                            <p:column headerText="Giá">
                                <h:outputText value="#{deliveryNoteDetails.price}">
                                    <f:convertNumber type="number"/>
                                </h:outputText>
                            </p:column>
                            
                            <p:column headerText="Khuyến mãi">
                                <h:outputText value="#{deliveryNoteDetails.discount}"/>
                            </p:column>
                            
                            <p:column>
                                <p:commandButton id="btnUpdateDeliveryNoteDetails" update=":updateDeliveryNoteDetailsForm" oncomplete="PF('updateDeliveryNoteDetailsDialog').show()" icon="ui-icon ui-icon-wrench" title="Sửa">
                                    <f:setPropertyActionListener value="#{deliveryNoteDetails}" target="#{deliveryNoteController.selectedDeliveryNoteDetails}"/>  
                                </p:commandButton>
                                <p:commandButton id="btnDelete" update=":deleteDetailsForm" oncomplete="PF('detailsconfirmation').show()" icon="ui-icon ui-icon-closethick" title="Xóa">
                                    <f:setPropertyActionListener value="#{deliveryNoteDetails}" target="#{deliveryNoteController.selectedDeliveryNoteDetails}"/>  
                                </p:commandButton>
                            </p:column>
                            
                        </p:dataTable>
                    </p:dialog>
                </h:form>
                
                
                <h:form id="updateDeliveryNoteForm">
                    <p:dialog header="Sửa" widgetVar="updateDeliveryNoteDialog" resizable="false"
                              showEffect="fade" hideEffect="fade" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:10px;" styleClass="my-panel-grid">
                            
                            <p:outputLabel value="ID:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.id}" disabled="true"/>
                        
                            <p:outputLabel value="Tên KH:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.username}"/>
                        
                        
                            <p:outputLabel value="Giới tính:"/>
                            <p:selectBooleanCheckbox value="#{deliveryNoteController.selectedDeliveryNote.gender}"/>
                        
                        
                            <p:outputLabel value="Điện thoại:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.phone}"/>
                        
                        
                            <p:outputLabel value="Địa chỉ:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.address}"/>
                        
                        
                            <p:outputLabel value="Cửa hàng:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.store.name}" disabled="true"/>
                        
                            <p:outputLabel value="Ngày:"/>
                            <p:calendar value="#{deliveryNoteController.selectedDeliveryNote.date}"/>

                            <p:outputLabel value="Tổng tiền:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNote.total}" disabled="true">
                                <f:convertNumber type="number"/>
                            </p:inputText>
                            
                            <p:outputLabel value="Duyệt?"/>
                            <p:selectBooleanCheckbox value="#{deliveryNoteController.selectedDeliveryNote.approve}"/>
                            
                            <p:outputLabel value="Giao?"/>
                            <p:selectBooleanCheckbox value="#{deliveryNoteController.selectedDeliveryNote.state}"/>

                            <f:facet name="footer">
                                <p:separator/>
                                <p:commandButton actionListener="#{deliveryNoteController.updateDeliveryNote()}" id="btnUpdateAccept" update=":insertForm, :messages" oncomplete="updateDeliveryNoteDialog.hide();" icon="icon-create" title="Cập nhật" value="Cập nhật"/>
                                <p:commandButton id="btnUpdateCancel" oncomplete="updateDeliveryNoteDialog.hide();" icon="icon-cancel" title="Hủy bỏ" value="Hủy bỏ"/>
                            </f:facet>
                        </h:panelGrid>
                    </p:dialog>  
                </h:form>
                
                <h:form id="updateDeliveryNoteDetailsForm">
                    <p:dialog header="Sửa" widgetVar="updateDeliveryNoteDetailsDialog" resizable="false"
                              showEffect="fade" hideEffect="fade" modal="true">  
                        <h:panelGrid id="display" columns="2" cellpadding="4" style="margin:10px;" styleClass="my-panel-grid">
                            
                            <p:outputLabel value="ID:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNoteDetails.id}" disabled="true"/>
                        
                            <p:outputLabel value="Sản phẩm:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNoteDetails.phoneCode.phone.name}" disabled="true"/>
                            
                            <p:outputLabel value="Màu:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNoteDetails.phoneCode.color.name}" disabled="true"/>
                        
                            <p:outputLabel value="Số lượng:"/>
                            <p:spinner value="#{deliveryNoteController.selectedDeliveryNoteDetails.quantity}" min="1"/>
                        
                        
                            <p:outputLabel value="Giá:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNoteDetails.price}" disabled="true">
                                <f:convertNumber type="number"/>
                            </p:inputText>
                        
                        
                            <p:outputLabel value="Khuyến mãi:"/>
                            <p:inputText value="#{deliveryNoteController.selectedDeliveryNoteDetails.discount}"/>
                        

                            <f:facet name="footer">
                                <p:separator/>
                                <p:commandButton actionListener="#{deliveryNoteController.updateDeliveryNoteDetails()}" id="btnUpdateAccept" update=":viewDetailsForm:deliveryNoteDetailsForm, :insertForm:deliveryNoteDataTable" oncomplete="updateDeliveryNoteDetailsDialog.hide();" icon="icon-create" title="Cập nhật" value="Cập nhật"/>
                                <p:commandButton id="btnUpdateCancel" oncomplete="updateDeliveryNoteDetailsDialog.hide();" icon="icon-cancel" title="Hủy bỏ" value="Hủy bỏ"/>
                            </f:facet>
                        </h:panelGrid>  
                    </p:dialog>  
                </h:form>
            </ui:define>
        </ui:composition>
    </h:body>
</html>